<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false"%>
<!-- 	导入Struts 2标签库 -->
<%@taglib uri="/struts-tags" prefix="s" %>
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>index</title>
    <link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>

<%--<h1>success !!! ${sessionScope.username} </h1>--%>
<table class="layui-hide" id="test1" lay-filter="test1"></table>


<script type="text/javascript" src="layui/layui.all.js"></script>
<script>
    layui.use(['table','form', 'layer','laydate', 'jquery'], function (table,form, layer,laydate, $) {
        var $ = layui.jquery, table = layui.table, form = layui.form;
        var tableIns = table.render({
            elem: '#test1'
            ,url:'picList.action'
            ,toolbar: '#toolbarDemo'
            ,title: '图片数据表'
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'id', title:'图片编号', width:120, fixed: 'left', unresize: true, sort: true,align: 'center'}
                ,{field:'path', title:'图片路径', width:420,sort: true}
                ,{field:'path', title:'图片下载', event: 'download' , align: "center" ,width:120,sort: true,templet: "<div><a href='downloadPic.action?fileName={{d.path}}' class='layui-table-link'>下载</a></div>"}
            ]]
            ,page: true //开启分页
            ,parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
                console.log(res);
                //之前ssm整合时候并没有手动转换，现在必须转换一下，
                // 后台返回的数据时字符串，先要转换为对象
                var d = $.parseJSON(res);
                return {
                    "code": d.code, //解析接口状态
                    "msg": d.msg, //解析提示文本
                    "count": d.count, //解析数据长度
                    "data": d.data //解析数据列表
                };
            }
        });
        //监听单元格事件
        table.on('tool(test1)', function(obj){
            var data = obj.data;
            if(obj.event === 'download'){
                layer.prompt({
                    formType: 2
                    ,title: '修改 ID 为 ['+ data.id +'] 的用户签名'
                    ,value: data.sign
                }, function(value, index){
                    layer.close(index);

                    //这里一般是发送修改的Ajax请求
                    $.post("download.action",data.field,function(res){
                        if(res.status){
                            layer.msg(res.info, {time: 2000});
                        }else{
                        }
                    },'json');
                    //同步更新表格和缓存对应的值
                    obj.update({
                        sign: value
                    });
                });
            }
        });
    });
</script>
</body>
</html>
